<!DOCTYPE html>
<html lang="zh-cn">
<head>
	<meta charset="UTF-8">
	<title>零基础HTML编码</title>
</head>
<body>
	<header>
		<h1>网站一级标题</h1>
		<ul>
			<li>导航链接1</li>
			<li>导航链接2</li>
			<li>导航链接3</li>
			<li>导航链接4</li>
		</ul>
	</header>

	<article>
		<hgroup>
			<h2>文章一级标题</h2>
			<h3>文章二级标题</h3>
		</hgroup>
		<p>陆逊 2016年9月19日</p>
		<p>这是一个很长的段落这是一个很长的段落这是一个很长的段落这是一个很长的段落这是一个很长的段落<br>
		一个很长的段落这是一个很长的段落这是一个很长的段落这是一个很长的段落这是一个很长的段落这是一个很长的段落这是
		<a href="http://ife.baidu.com">这是一个链接到http://ife.baiduy.com的链接</a></p>
		<img src="http://f.hiphotos.baidu.com/image/h%3D200/sign=269538a28344ebf87271633fe9f8d736/2e2eb9389b504fc29897b1a4e1dde71191ef6d42.jpg" alt="">
		<p>个很长的段落这是一个很个很长的段落这是一个很个很长的段落这是一个很个很长的段落这是一个很</p>
	</article>

	<article>
		<hgroup>
			<h2>另一篇文章一级标题</h2>
			<h3>文章二级标题</h3>
		</hgroup>
		<p>陆逊 2016年9月19日</p>
		<p>这是一个很长的段落这是一个很长的段落这是一个很长的段落这是一个很长的段落这是一个很长的段落<br>
		一个很长的段落这是一个很长的段落这是一个很长的段落这是一个很长的段落这是一个很长的段落这是一个很长的段落这是
		<a href="http://ife.baidu.com">这是一个链接到http://ife.baiduy.com的链接</a></p>
		<img src="http://f.hiphotos.baidu.com/image/h%3D200/sign=269538a28344ebf87271633fe9f8d736/2e2eb9389b504fc29897b1a4e1dde71191ef6d42.jpg" alt="">
		<p>个很长的段落这是一个很个很长的段落这是一个很个很长的段落这是一个很个很长的段落这是一个很</p>
		<ol>
			<li>列表项目一</li>
			<li>列表项目二</li>
			<li>列表项目三</li>
		</ol>
		<section>
			<h2>蜡笔小新图片</h2>
			<figure>
				<figcaption>蜡笔小新</figcaption>
				<img src="http://attach.bbs.miui.com/forum/201203/20/170226n5qcwdpusnjdsswy.jpg" alt="蜡笔小新">
			</figure>
			<figure>
				<figcaption>蜡笔小新</figcaption>
				<img src="http://attach.bbs.miui.com/forum/201203/20/170226n5qcwdpusnjdsswy.jpg" alt="蜡笔小新">
			</figure>
			<figure>
				<figcaption>蜡笔小新</figcaption>
				<img src="http://attach.bbs.miui.com/forum/201203/20/170226n5qcwdpusnjdsswy.jpg" alt="蜡笔小新">
			</figure>
			<figure>
				<figcaption>蜡笔小新</figcaption>
				<img src="http://attach.bbs.miui.com/forum/201203/20/170226n5qcwdpusnjdsswy.jpg" alt="蜡笔小新">
			</figure>
			<figure>
				<figcaption>蜡笔小新</figcaption>
				<img src="http://attach.bbs.miui.com/forum/201203/20/170226n5qcwdpusnjdsswy.jpg" alt="蜡笔小新">
			</figure>
		</section>
	</article>

	<article>
		<h2>最后一篇文章的一级标题</h2>
		<h3>文章二级标题</h3>
		<p>小新 2016年9月19日</p>
		<p>下面是一个表格，给表格加一个border="1"好让你看出是一个表格</p>
		<table border="1">
			<thead>
				<tr>
					<th>表头</th>
					<th>表头</th>
					<th>表头</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>表内单元格</td>
					<td>表内单元格</td>
					<td><a href="">操作</a></td>
				</tr>
			
				<tr>
					<td>表内单元格</td>
					<td>表内单元格</td>
					<td><a href="">操作</a></td>
				</tr>
			
				<tr>
					<td>表内单元格</td>
					<td>表内单元格</td>
					<td><a href="">操作</a></td>
				</tr>
			
				<tr>
					<td>表内单元格</td>
					<td>表内单元格</td>
					<td><a href="">操作</a></td>
				</tr>
			
			</tbody>
			<tfoot>
				<tr>
					<td>总计</td>
					<td colspan="2">1000</td>
				</tr>
			</tfoot>
		</table>
	</article>

	<aside>
		<h2>这里以后是一个侧栏，这是侧栏的标题</h2>
		<h2>侧栏注册窗口标题</h2>
		<form action="">
			<label for="email">请输入邮箱地址：</label>
			<input type="email" id="email" placeholder="请输入邮箱地址">
			<p>邮箱地址请按要求格式输入</p>
			<label for="pa">请输入密码</label>
			<input type="password" placeholder="请输入密码" id="pa">
			<label for="pas">请再次输入密码：</label>
			<input type="password" id="pas" paceholder="请再次输入密码">
			<p>密码请为6-16位英文数字</p>
			性别：
			<input type="radio" name="sex" value="male" id="male">
			<label for="male">男</label>
			<input type="radio" name="sex" value="male" id="female">
			<label for="female">女</label>
			城市：
			<select>
				<option value="beijing">北京</option>
				<option value="shanghai">上海</option>
			</select>
			爱好：
			<input type="checkbox" value="sport" id="sport"><label for="sport">运动</label>
			<input type="checkbox" value="art" id="art"><label for="art">艺术</label>
			<input type="checkbox" value="science" id="science"><label for="science">科学</label>
			个人描述：
			<textarea name="miaoshu" id="miaoshu" cols="10" rows="2">这是一个个人描述</textarea>
			<input type="submit" value="确认提交">
		</form>
	</aside>

	<footer>
		<span>版权所有</span>
	</footer>
</body>
</html>